<!--
 * @Author: AFun
-->
<template>
  <div
    class="ui-qrcode flex mr-1 mt-0"
    :class="[
      'mt-' + (info.extension.topMargin && info.extension.topMargin.value),
      'mr-' + (info.extension.rightMargin && info.extension.rightMargin.value),
      'mb-' + (info.extension.bottomMargin && info.extension.bottomMargin.value),
      'ml-' + (info.extension.leftMargin && info.extension.leftMargin.value),
    ]"
  >
    <vue-qrcode
      v-if="info.extension.model.value"
      :ref="info._id"
      v-ui-ref="vSetRef"
      :options="{ width: `${info.extension.width.value}` }"
      :value="`${info.extension.model.value}`"
    />
  </div>
</template>
<script>
  import { defineComponent } from 'vue'
  import VueQrcode from '@chenfengyuan/vue-qrcode'
  import { UiMixin, RefsInjectMixin } from '@ve/mixin'
  export default defineComponent({
    name: 'UiPdaQrcode',
    components: { VueQrcode },
    mixins: [UiMixin, RefsInjectMixin],
    data() {
      return {}
    },
    computed: {
      // getDataSource() {
      //   return this.info.dataSourceBind.sourceId
      // },
    },
  })
</script>
<style scoped></style>
